<template>
	<view class="pay-status">
		<view class="status-icon">
			<view class="check-circle-filled">
				<image src="@/static/check-circle-filled.png" mode="widthFix"></image>
			</view>
			<view class="status-text">提交成功</view>
		</view>
		
		<view class="" style="padding-top: 80rpx;">
			<button class="confirm">查看订单详情</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			};
		},
		onShareAppMessage(){},
		onShareTimeline() {},
	}
</script>

<style lang="scss" scoped>
	.pay-status {
		position: relative;
		width: 100%;
		z-index: 999;
		height: 100vh;
		padding: 0 84rpx;
		overflow-x: hidden;
		box-sizing: border-box;
		
		&::after {
			position: absolute;
			content: '';
			top: 0;
			left: 50%;
			right: 0;
			z-index: -1;
			width: 160%;
			height: 30%;
			border-radius: 0 0 80% 80%;
			transform: translateX(-50%);
			background: linear-gradient(180deg, #F6F6F6 0%, #E5E5E5 100%);
		}
		
		.check-circle-filled {
			width: 120rpx;
			height: 120rpx;
			
			image {
				width: 100%;
			}
		}
		
		.status-icon {
			height: 30vh;
			display: flex;
			align-items: center;
			flex-direction: column;
			justify-content: center;
			
			.status-text {
				padding-top: 22rpx;
				font-size: 34rpx;
				font-weight: 600;
				line-height: 46rpx;
				text-align: left;
				color: #000000;
			}
		}
	}
</style>
